<template>
    <div class="bg-white mt-[10px]">
        <BaseHead> 依托项目列表</BaseHead>
        <div class="p-[10px] w-10/12 mx-auto">
            <el-table :data="projectTable" border style="width: 100%">
                <el-table-column prop="name" label="项目名称" />
                <el-table-column prop="chargerName" label="负责人" />
                <el-table-column prop="unitId" label="所属单位" :formatter="formatssdwId" />
                <el-table-column prop="authorizeDate" label="签订日期" />
                <el-table-column prop="feeAuthorize" label="项目经费（万元）" :formatter="formatfeeAuthorize" />
                <el-table-column prop="allMember" label="所有成员" />
            </el-table>
        </div>
    </div>
    <div class="bg-white mt-[10px]">
        <BaseHead> 依托项目新增</BaseHead>
        <div class="p-[10px] w-10/12 mx-auto">
            <el-form :model="ruleForm" label-width="auto">
                <el-row :gutter="20" class="mt-[10px]">
                    <el-col :span="12">
                        <el-form-item label="负责人">
                            <el-select v-model="ruleForm.chargerCode">
                                <el-option v-for="item in userAllList" :key="item.personId" :label="item.authorName"
                                    :value="item.personId" />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="项目状态	">
                            <el-select v-model="ruleForm.projectStatusId">
                                <el-option v-for="item in xmztList" :key="item.code" :label="item.name"
                                    :value="item.code" />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <div class="flex justify-center"> <el-button type="primary" @click="getProjectByUserMet">查询</el-button>
                </div>
            </el-form>
            <div class="flex justify-center mt-5 mb-10">
                <el-transfer v-model="pojectValue" :props="{
                key: 'id',
                label: 'name',
            }" :data="pojectData" :titles="['可选项目', '已选项目']" />
            </div>
        </div>
    </div>

</template>
<script setup>
import BaseHead from "@/views/project/components/BaseHead.vue";
import { getCategory } from "@/api/system/category"
import { ElTransfer, ElMessage } from "element-plus";
import { getProjectByUser, relyProjectSave, getByProductId } from "@/api/achievement/common"
import { turnWanyuan } from "@/utils/money.js"
const props = defineProps({
    userList: Array,
    type: String,
    productId: String,
})
const ruleForm = reactive({
    chargerCode: '',
    projectStatusId: '全部'
})
const xmztList = ref([])
const userAllList = ref([])
const pojectData = ref([])
const pojectValue = ref([])
const projectTable = ref([])
const zcgsdwList = ref([])
const getCategoryMet = async () => {
    let parms = {
        bizName: "项目状态"
    }
    let res = await getCategory(parms)
    if (res.code == 200) {
        xmztList.value = res.data
        xmztList.value.unshift({ code: '全部', name: '全部' })
    }
}
const getCategoryMet1 = async () => {
    let parms = {
        bizName: "成果归属单位"
    }
    let res = await getCategory(parms)
    if (res.code == 200) {
        zcgsdwList.value = res.data
    }
}
const formatssdwId = (row, column, cellValue, index) => {
    if (zcgsdwList.value.length && cellValue) {
        return zcgsdwList.value.find(item => item.codeColumn == cellValue).valueColumn
    } else {
        return ''
    }
}


const formatfeeAuthorize = (row, column, cellValue, index) => {
    if (cellValue) {
        return turnWanyuan(cellValue, 0)
    } else {
        return ''
    }
}



const getProjectByUserMet = async () => {

    let parms = {
        ...ruleForm
    }
    if (ruleForm.projectStatusId == '全部') {
        parms.projectStatusId = ''
    }
    let res = await getProjectByUser(parms)
    if (res.code == 200) {
        pojectData.value = res.data

    }
}
const emit = defineEmits(['closesupport']);
const relyProjectSaveMet = async (i) => {
    let parms = {}
    let productDTOList = []
    pojectValue.value.forEach(item => {
        productDTOList.push({
            productId: props.productId,
            productType: props.type,
            projectId: item
        })
    })
    parms.productId = props.productId
    parms.productDTOList = productDTOList
    let res = await relyProjectSave(parms)
    if (res.code == 200) {
        ElMessage({
            type: 'success',
            message: res.msg
        })
        if (i == 1) {
            emit('closesupport', "1")
        } else {
            emit('closesupport', "")
        }

    }
}
const getprojectTable = async () => {
    let res = await getByProductId(props.productId)
    if (res.code == 200) {
        projectTable.value = res.data
        pojectValue.value = res.data.map(item => {
            return item.id
        })
    }
}

const initial = (i) => {
    console.log(i, 'props.userList')
    userAllList.value = []
    i.forEach(item => {
        userAllList.value.push({ personId: item.personId, authorName: item.authorName })
    })
    if (i && i.length > 1) {
        let allId = i.map(item => {
            return item.personId
        }).join(',')
        userAllList.value.unshift({
            personId: allId, authorName: '全部'
        })
        ruleForm.chargerCode = allId
    } else {
        ruleForm.chargerCode = i[0].personId
    }

    getProjectByUserMet()
    getprojectTable()
}
onMounted(() => {
    getCategoryMet()
    getCategoryMet1()
})
defineExpose({
    relyProjectSaveMet,
    initial
})
</script>
<style lang="scss" scoped>
:deep(.el-transfer-panel) {
    width: 400px;
    height: 400px;

    .el-transfer-panel__body {
        height: 360px;

        .el-transfer-panel__list {
            height: 100%
        }
    }

}
</style>